{%extends 'index.html'%}

{%block style%}
<style type="text/css">
  header{
    background: #eee;
    font-family: '楷体';
    height: 7rem;
    margin-bottom: 20px;
  }
  header>div>h2{
    line-height: 6rem;
    margin-top: 4px;
  }
  .mydiv{
    margin-bottom: 20px;
  }
</style>
{%endblock%}

{%block content%}
<header>
    <div class="container">
        <h2>视频管理</h2>
    </div>
</header>

<div class="container">
        
        <div class="btn-group btn-group-lg mydiv">
            <a href="#"><button type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span>添加</button></a>
          
        </div>
        <div class="btn-group btn-group-lg mydiv">
            <a href="/video_next_page/video"><button type="button" class="btn btn-default">所有视频</button></a>
        </div>
        <div class="text-center">
          <table class="table table-bordered text-center">
            
            <thead>
              <tr>
                <th class="text-center">序号</th>
                <th class="text-center">名称</th>
                <th class="text-center">介绍</th>
                <th class="text-center">讲师</th>
                <th class="text-center">播放次数</th>
                <th class="text-center">时长</th>
                <th class="text-center">编辑</th>
                <th class="text-center">删除</th>
              </tr>
            </thead>
            <tbody >
              {%for item in all_videos%}
              <tr >
                <th>{{item.title}}</th>
                <th>1</th>
                <th>{{item.abstract}}</th>
                <th>{{item.t_id}}</th>
                <th>{{item.hits}}</th>
                <th>{{item.time}}</th>
                <th><a href="#"><span class="glyphicon glyphicon-edit"></span></a></th>
                <th><a href="#" onclick="remove_video('{{item.title}}','{{item.id}}')"><span class="glyphicon glyphicon-trash"></span></a></th>
              </tr>
              {%endfor%}
            </tbody>
          </table>
        </div>
</div>

<!-- 模态框 -->
<div class="modal fade" id="myVideo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" 
            aria-hidden="true">×
        </button>
        <h4 class="modal-title" id="myModalLabel">
          视频的管理：
        </h4>
      </div>
      <div class="modal-body">
        确认要删除吗？
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" 
            data-dismiss="modal">关闭
        </button>
        <button type="button" class="btn btn-primary video_remove">
          提交更改
        </button>
      </div>

{%endblock%}

{% block script %}
<script type="text/javascript" src="/static/course.js"></script>
{% endblock %}